import React from 'react';
import './index.scss' // 样式引入
import classnames from 'classnames'
import { connect } from 'react-redux';

import { Breadcrumb } from 'antd';
import { HomeOutlined } from '@ant-design/icons';

import { getDomain } from '@/config'
import testWorker from "@/mainWorker/test.js";

const demoImg = require("@/assets/images/default/icon-no-student.png").default;
const demoVideo = require("@/assets/videos/2017830.mp4").default;

class App extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            name: "home"
        }
    }
    componentDidMount () {
        try {
            testWorker.init(data => {
                console.log(data);
            });
            testWorker.business(100000);
            // console.log(BASE_URL)
        } catch (e) {
            console.log(e)
        }
        // console.log(getDomain())
    }
    toDetail (path) {
        // this.props.history.replace('/detail');
        let url = `${path}?id=123&name=jhon`
        this.props.history.push(url)
    }
    render () {
        // const { name } = this.state
        const { userInfo, token } = this.props
        return (
            <div className={classnames("home-container", { 'test': true })}>
                <div>
                    <Breadcrumb>
                        <Breadcrumb.Item>
                            <HomeOutlined />
                            <span>react应用</span>
                        </Breadcrumb.Item>
                    </Breadcrumb>
                </div>
                {
                    userInfo.role && <div>用户角色：{userInfo.role}</div>
                }
                {
                    token && <div>token：{token}</div>
                }
                <div onClick={() => this.toDetail('/reactApp/detail')}>查看详情</div>
                {/* <div className="img-box"></div>
                <img src={demoImg} />
                <video src={demoVideo} controls="controls" /> */}
            </div>
        )
    }
}



/**
 * @description: 需要渲染什么数据
 */
function mapStateToProps (state) {
    return {
        userInfo: state.userInfo,
        token: state.token
    }
}

export default connect(mapStateToProps)(App)